<!DOCTYPE html>
<html>
<head lang="zh-CN">
    <meta charset="UTF-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>极客-商品详情</title>
    <link rel="stylesheet" href="css/base.css"/>
    <link rel="stylesheet" href="css/header.css"/>
    <link rel="stylesheet" href="css/footer.css"/>
    <link rel="stylesheet" href="css/product_details.css"/>
	<link rel="icon" href="img/zc.ico">
</head>
<body>
    <div id="main">
        <div id="header">
        </div>
        <div id="container">
            <div class="loc">
                <span>
                    <a href="index.html">首页</a>
                </span>
                >
                <span>
                    <a href="product_search.html">所有商品</a>
                </span>
                >
                <span>
                    惠普博锐系列-惠普Envy13
                </span>
            </div>
            <div class="product">
                <div class="pro_pic">
                    <div class="pro_md">
                        <div id="mask"></div>
                        <div id="superMask"></div>
                        <div id="pro_md_pic">
                            <img src="img/init.png" data-src="img/product_details/md/hp_01.jpg" alt=""/>
                        </div>
                    </div>
                    <div id="pro_lg_pic" class="pro_lg_pic">
                    </div>
                    <div class="pro_sm_list">
                        <div class="arrow_lf disable" data-arrow="lf">
                        </div>
                        <div class="pro_sm_pic">
                            <ul class="sm_pic_list" data-pic="sm_list">
                                <li class="sm_active">
                                    <img src="img/init.png" data-src="img/product_details/sm/hp_01.jpg" alt=""/>
                                </li>
                                <li><img src="img/init.png" data-src="img/product_details/sm/hp_02.jpg" alt=""/></li>
                                <li><img src="img/init.png" data-src="img/product_details/sm/hp_03.jpg" alt=""/></li>
                                <li><img src="img/init.png" data-src="img/product_details/sm/hp_04.jpg" alt=""/></li>
                                <li><img src="img/init.png" data-src="img/product_details/sm/hp_05.jpg" alt=""/></li>
                                <li><img src="img/init.png" data-src="img/product_details/sm/hp_06.jpg" alt=""/></li>
                                <li><img src="img/init.png" data-src="img/product_details/sm/hp_07.jpg" alt=""/></li>
                                <li><img src="img/init.png" data-src="img/product_details/sm/hp_08.jpg" alt=""/></li>
                            </ul>
                        </div>
                        <div class="arrow_rg" data-arrow="rg">
                        </div>
                    </div>
                </div>
                <div class="pro_detail">
                    <h2 class="pro_title">
                        惠普（HP）薄锐ENVY 13-ad110TU 13.3英寸超轻薄笔记本（i5-8250U 8G 256GSSD FHD Win10）银色
                    </h2>
                    <p class="pro_subtitle">
                        一体成型金属机身，纤薄轻巧，长达12小时续航！
                        <br/>
                        从新开始！轻薄便携，买即送电脑包，赠完即止!
                        <br/>
                        3.06mm超窄边框！72%色域！13.95mm+1.23KG！做工精良！全金属机身！
                    </p>
                    <p class="pro_price">
                        <span class="item">极&nbsp;客&nbsp;价</span>
                        <span class="rmb">&yen;</span>
                        <span class="price">5979</span>
                        <span class="sold">已售出&nbsp;2&nbsp;件</span>
                    </p>
                    <div class="pro_spec">
                        <span class="item">规&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;格</span>
                        <div class="spec_list" data-spec="spec_list">
                            <a href="#" class="spec_item active">双核i5/8GB内存/128GB闪存</a>
                            <a href="#" class="spec_item">双核i5/8GB内存/256GB闪存</a>
                            <a href="#" class="spec_item">定制款：双核i7/8G内存/128G闪存</a>
                            <a href="#" class="spec_item">定制款：双核i7/8G内存/256G闪存</a>
                        </div>
                    </div>
                    <div class="pro_quantity">
                        <span class="item">选择数量</span>
                        <div class="count">
                            <button class="btns" data-btns="count">-</button>
                            <input data-input="counts"  class="input_count" type="text" value="1"/>
                            <button class="btns" data-btns="count">+</button>
                            <span class="repertory">件&nbsp;&nbsp;&nbsp;&nbsp;库存（19）件</span>
                        </div>
                    </div>
                    <div class="pro_buy">
                        <button data-btns="now_buy" class="buy_btns buy">立即购买</button>
                        <button data-btns="add_cart" class="buy_btns cart">加入购物车</button>
                    </div>
                    <div class="pro_comment">
                        <span>
                            <img src="img/init.png" data-src="img/product_details/star.png" alt=""/>
                            好评度66%</span>
                        <span>
                            <img src="img/init.png" data-src="img/product_details/star.png" alt=""/>
                            累计评价&nbsp;&nbsp;&nbsp;2</span>
                    </div>
                </div>
            </div>
            <div class="details">
                <div class="details_tab">
                    <span class="intro details_active" data-detail="tab_intro">
                        商品简介
                    </span>
                    <span class="evaluate" data-detail="tab_eval">
                        商品评价（2）
                    </span>
                </div>
                <div class="details_items">
                    <div class="parameter" data-detail="intro">
                        <p class="parameter_brand">
                            品牌： 惠普（HP）
                        </p>
                        <ul class="parameter_list">
                            <li>商品名称：惠普Envy13</li>
                            <li>商品毛重：2.45kg</li>
                            <li>商品产地：中国大陆</li>
                            <li>系统：Windows 10</li>
                            <li>分辨率：全高清屏（1920×1080）</li>
                            <li>厚度：10.0mm—15.0mm</li>
                            <li>内存容量：8G</li>
                            <li>处理器：Intel i7低功耗版</li>
                            <li>硬盘容量：其他</li>
                            <li>显卡型号：其他</li>
                            <li>游戏性能：入门级</li>
                            <li>显卡类别：集成显卡</li>
                            <li>分类：轻薄本</li>
                            <li>裸机重量：1-1.5KG</li>
                            <li>屏幕尺寸：13.3英寸</li>
                        </ul>
                    </div>
                    <div class="details_pics" data-detail="intro">
                        <img src="img/init.png" data-src="img/product_details/details10.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details01.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details02.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details03.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details04.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details05.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details06.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details07.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details08.jpg" alt=""/>
                        <img src="img/init.png" data-src="img/product_details/details09.jpg" alt=""/>
                    </div data-d>
                    <div class="details_evaluate" data-detail="evaluate">
                        <div class="comment">
                            <div class="comment_percent">
                                <p class="comment_degree">
                                    好评度
                                </p>
                                <p class="comment_con">
                                    96%
                                </p>
                            </div>
                            <ul class="comment_info" data-comment="info_list">
                                <li>外观时尚（16）</li>
                                <li>挺快的(13)</li>
                                <li>漂亮大气(12)</li>
                                <li>性价比高(12)</li>
                                <li>速度飞快(10)</li>
                                <li>很轻薄(8)</li>
                                <li>物流很快(5)</li>
                                <li>运行平稳(5)</li>
                            </ul>
                        </div>
                        <div class="user_comment">
                            <div class="user_coment_tab">
                                <span>全部评价(2)</span>
                                <span>晒图(0)</span>
                                <span>追评(0)</span>
                                <span>好评(2)</span>
                                <span>中评(0)</span>
                                <span>差评(0)</span>
                            </div>
                            <div class="user_comment_content">
                                <div class="user_coment_info">
                                    <div class="user_info">
                                        <img src="img/init.png" data-src="img/product_details/user.png" alt=""/>
                                        <span>f****s</span>
                                    </div>
                                    <div class="comment_items">
                                        <p>★★★★</p>
                                        <p>笔记本很薄，键盘感觉不错</p>
                                        <p>四核i5【8G360GSSD】月光银&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2017-12-20 21:03</p>
                                    </div>
                                </div>
                            </div>
                            <div class="user_comment_content">
                                <div class="user_coment_info">
                                    <div class="user_info">
                                        <img src="img/init.png" data-src="img/product_details/user.png" alt=""/>
                                        <span>j*****k</span>
                                    </div>
                                    <div class="comment_items">
                                        <p>★★★★★</p>
                                        <p>超好用，强烈推荐！</p>
                                        <p>四核i5【8G360GSSD】月光银&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;2018-01-05 12:03</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="footer">
        </div>
    </div>
<script src="js/jquery-3.2.1.js"></script>
<script src="js/base.js"></script>
<script src="js/product_details.js"></script>
</body>
</html>